<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn" %>
<%@ taglib prefix="custom" tagdir="/WEB-INF/tags" %>
<html>
<head>
    <title>自助绑定审核列表</title>
    <link href="${contextPath}/resources/css/bootstrap-datetimepicker.min.css" rel="stylesheet" media="screen">
    <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=h0EKj4yWH81COWhXGS4G7uyi"></script>
    <script type="text/javascript" charset="utf-8" src="${contextPath}/resources/ueditor/ueditor.config.js"></script>
    <script type="text/javascript" charset="utf-8" src="${contextPath}/resources/ueditor/ueditor.all.min.js"></script>
    <script type="text/javascript" charset="utf-8" src="${contextPath}/resources/ueditor/lang/zh-cn/zh-cn.js"></script>
</head>

<body>
<div class="pageheader">
    <h2>自助绑定列表</h2>
</div>
<div class="contentpanel">
    <form class="form-inline" id="filterForm">
        <input type="hidden" name="auditing" value="${listDto.auditing}" id="targetStatus"/>

        <div class="col-10" style="margin-bottom:10px;">
            <input type="text" class="form-control" name="key"
                   value="${listDto.key}" placeholder="姓名/电话/部门">

            <div class="input-group date form_date col-md-2">
                <input class="form-control start-time" name="startTime" size="16" type="text"
                       value="${listDto.startTime}" readonly
                       data-date="" data-date-format="yyyy-MM-dd" placeholder="开始时间"
                       data-link-field="dtp_input2" data-link-format="yyyy-mm-dd">
                <span class="input-group-addon"><span class="glyphicon glyphicon-remove"></span></span>
            </div>
            <div class="input-group date form_date col-md-2">
                <input class="form-control end-time" name="endTime" size="16" type="text"
                       value="${listDto.endTime}"
                       readonly
                       data-date="" data-date-format="yyyy-MM-dd" placeholder="结束时间"
                       data-link-field="dtp_input2" data-link-format="yyyy-mm-dd">
                <span class="input-group-addon"><span class="glyphicon glyphicon-remove"></span></span>
            </div>
            <button type="submit" class="form-control btn-success">查询</button>

        </div>
        <ul id="myTabs" class="nav nav-tabs" role="tablist">
            <li role="presentation" class="dropdown ${listDto.auditing eq false ? "active":""}">
                <a href="#" class="dropdown-toggle statusItem" data-toggle="dropdown" targetStatus="false"
                   aria-controls="myTabDrop1-contents" aria-expanded="false">
                    未审核
                </a>
            </li>
            <li role="presentation" class="dropdown ${listDto.auditing eq true ? "active":""}">
                <a href="#" class="dropdown-toggle statusItem" data-toggle="dropdown" targetStatus="true"
                   aria-controls="myTabDrop1-contents" aria-expanded="false">
                    已审核
                </a>
            </li>
        </ul>
    </form>

    <table class="table table-striped dataTable no-footer" id="table2" role="grid" aria-describedby="table2_info">
        <thead>
        <tr role="row">
            <th class="sorting_asc" tabindex="0" aria-controls="table2"
                rowspan="1" colspan="1" aria-sort="ascending">
                创建人
            </th>
            <th class="sorting_asc" tabindex="0" aria-controls="table2"
                rowspan="1" colspan="1" aria-sort="ascending">
                姓名
            </th>
            <th class="sorting_asc" tabindex="0" aria-controls="table2"
                rowspan="1" colspan="1" aria-sort="ascending">
                部门
            </th>
            <th class="sorting_asc" tabindex="0" aria-controls="table2"
                rowspan="1" colspan="1" aria-sort="ascending">
                电话
            </th>
            <th class="sorting_asc" tabindex="0" aria-controls="table2"
                rowspan="1" colspan="1" aria-sort="ascending">
                创建时间
            </th>
            <th class="sorting_asc" tabindex="0" aria-controls="table2"
                rowspan="1" colspan="1" aria-sort="ascending">
                审核状态
            </th>
            <th class="sorting" tabindex="0" aria-controls="table2" rowspan="1" colspan="1">
                操作
            </th>
        </tr>
        </thead>
        <tbody>
        <c:forEach items="${listDto.list}" var="item" varStatus="status">
            <tr class="gradeA ${status.index/2 eq 0?"odd":"even"}">
                <td>${item.memberDto.nickname}</td>
                <td>${item.employeeName}</td>
                <td>${item.deptName}</td>
                <td>
                    <span class="label label-primary">
                        <c:if test="${ empty item.phone}">未填写</c:if>
                        <c:if test="${not empty item.phone}">${item.phone}</c:if>
                    </span>
                </td>
                <td>
                    <span class="label label-default">${item.createDateTime}</span>
                </td>
                <td>
                    <c:if test="${item.auditing ==false}">
                        <span class="label label-warning">未审核</span>
                    </c:if>
                    <c:if test="${item.auditing ==true}">
                        <span class="label label-success">已审核</span>
                    </c:if>
                </td>
                <td>
                    <c:if test="${item.auditing == true}">
                        <a href="#" class="btn btn-success" type="button" disabled="disabled">
                            已审核
                        </a>
                    </c:if>
                    <c:if test="${item.auditing ==false}">
                        <form class="form-inline" action="self_binding.htm" method="post">
                            <input type="hidden" name="uuid" value="${item.uuid}"/>
                            <button type="submit" class="btn btn-danger"
                                    onclick="return confirm('确定审核[${item.employeeName}]?');">
                                审核
                            </button>
                        </form>
                    </c:if>
                </td>
            </tr>
        </c:forEach>
        </tbody>
    </table>
    <custom:page page="${listDto}"/>

    <c:if test="${not empty param.edit}">
        <script type="text/javascript">
            jQuery.gritter.add({
                title: '新增/编辑 成功!',
                class_name: "growl-success",
                sticky: false
            });
        </script>
    </c:if>
    <c:if test="${not empty param.success}">
        <script type="text/javascript">
            jQuery.gritter.add({
                title: '审核 成功!',
                class_name: "growl-success",
                sticky: false
            });
        </script>
    </c:if>
    <c:if test="${not empty param.fail}">
        <script type="text/javascript">
            jQuery.gritter.add({
                title: '审核失败!数据不符合',
                class_name: "growl-warning",
                sticky: false
            });
        </script>
    </c:if>
</div>
<script src="${contextPath}/resources/js/jquery.datatables.min.js"></script>
<script type="text/javascript" src="${contextPath}/resources/js/bootstrap-datetimepicker.js" charset="UTF-8"></script>
<script type="text/javascript" src="${contextPath}/resources/js/locales/bootstrap-datetimepicker.zh-CN.js"
        charset="UTF-8"></script>
<script type="text/javascript">
    jQuery(document).ready(function () {
        jQuery('#table2').dataTable({
            "bPaginate": false,// 分页按钮
            "bFilter": false,// 搜索栏
            "bLengthChange": false,// 每行显示记录数
            "bInfo": false
        });
    });
    $(function () {
        $(".end-time").click(function () {
            var startTime = $(".start-time").val();
            $('.end-time').datetimepicker('setStartDate', startTime);
        });
        $(".start-time").click(function () {
            var time = $(".end-time").val();
            $('.start-time').datetimepicker('setEndDate', time);
        });
        $(".glyphicon-remove").click(function () {
            var parents = $(this).parents(".input-group");
            var find = parents.find(".form-control");
            find.attr("value", "");
        });
    });

    $('.end-time,.start-time').datetimepicker({
        language: 'zh-CN',
        weekStart: 1,
        todayBtn: 1,
        autoclose: 1,
        todayHighlight: 1,
        startView: 2,
        minView: 2,
        forceParse: 0
    });
    $("#myTabs .statusItem").click(function () {
        var auditing = $(this).attr("targetStatus");
        $("#targetStatus").val(auditing);
        $("#filterForm").submit();
    });
</script>

</body>
</html>
